import React,{Component} from 'react'
import {Link,browserHistory} from 'react-router'
import * as pub from '../../config/public';
import * as fetch from '../../config/fetch'
import {Spin,message,Button} from 'antd'
import Pages from '../Pages';
import Layer from '../Layer';
class CharMore extends Component {
	constructor(props) {
		super(props);
		this.state = {
		    charMoreList:[],
		    loading : false,
			totalPage : 0 ,
			visibleDH:false,
			jumpPage : 1,
			loadBtning:false
		}
	}
	hideModelDH(){
			this.setState({
				visibleDH: false,
			});
	}
	ok(id){
		pub.loadBtning(this,true);
		fetch.cashEssay({essayId:id}).then((data)=>{
			if(data.result === 'RC100'){
				message.success(data.errMsg, 3)
				pub.jumpHistory.push("/ArticleDetail/" +id)
			}else{
				message.error(data.errMsg, 3);
			}
			pub.loadBtning(this,false);
		}, (res) => {
			pub.reject(res);
			pub.loadBtning(this,false);
		})
	}
	clickArticle(item) {
		if (item.goodEssay === '1') {
			if (item.userEssayOperation.isBuy === 1) {
				pub.jumpHistory.push("/ArticleDetail/" + item.essayId)
			} else {
				this.setState({
					visibleDH: true,
					essayId: item.essayId,
					studyIntegral: item.exchangeIntegral
				})
			}
		} else {
			pub.jumpHistory.push("/ArticleDetail/" + item.essayId)
		}
	}
	getCharList(){
		pub.loading(this,true);
		fetch.moreEssay({pageno:this.state.jumpPage}).then((data) => {
			this.setState({
				charMoreList: data.myEssayDongList?data.myEssayDongList:[],
                totalPage:data.totalPage?data.totalPage:0
			});
			pub.loading(this,false);
		},(res)=>{
			pub.loading(this,false);
			pub.reject(res);
		})
	}
	 componentWillMount() {
	    this.getCharList();
	 }
	 jump(page) {
		 this.setState({
			jumpPage:page, 
		 },function(){
			 this.getCharList();
		 })
	 }
	 operate(id, type) {
		fetch.operateArticle(id, type).then((data) => {
			if (data.result === 'RC100') {
				this.getCharList();
				message.success(data.msg, 3);
			}else{
				message.error(data.errMsg, 3);
			}
		})
	}
	render(){
		return(
				<div className="wrapper bg-F0F4F6">
					<div className="layout clearFix pad-t-20">
						<div className="common-title">
							<span>蜂行圈动态</span>
						</div>
						<Spin spinning={this.state.loading} tip="加载列表中...">
						{
							this.state.charMoreList.map((item,index)=>{
								return(
									<div key={index} className="panel-120 charMoreHeight bg-FFFFFF box-shadow">
										<Link onClick={() => this.clickArticle(item)}>
										<div className="author-msg">
											<img src={pub.getFile(item.headPath)} onError={(e) => pub.headImageError(e)} alt="蜂行圈动态" />
											<p><span>{item.userRealName?item.userRealName:''}</span><span>{item.branchOffice?item.branchOffice:''}</span></p>
											<p className="time">{item.updateTime?item.updateTime:''}</p>
											<div className="jing"></div>
										</div>
										<a className="article1-list">
											<p className="title">{item.essayTitle?item.essayTitle:''}</p>
											<p className="content shorthand">{item.essayNote?pub.subString(item.essayNote,100):'没有文字'}</p>
											{
												item.essayPhotos.length !== 0 ?
													<img src={pub.getFile(item.essayPhotos[0].essayPhotoPath)} alt="蜂行圈动态" />
												:''
											}
										</a>
										</Link>
										<div className="collect-like">
											<span onClick={()=>this.operate(item.essayId,'1')} style={{opacity:item.userEssayOperation.isCollection === 1 ? 1:0.4}}><i className="icon-heart"></i>{item.sumCollection?item.sumCollection:''}</span>
											<span onClick={()=>this.operate(item.essayId,'0')} style={{opacity:item.userEssayOperation.isLike === 1 ?1:0.4}}><i className="icon-thumbs-up"></i>{item.sumLike?item.sumLike:''}</span>
										</div>
									</div>
								)
							})
						}
						</Spin>
						<Layer
							title="设置兑换积分"
							show={this.state.visibleDH}
							hide={(e) => { this.setState({ visibleDH: false }) }}
							width="400px"
							height="270px"
						>
							<div className="row">
								<div className="pop-box-1" style={{ textAlign: 'left' }}>
									<p style={{ textAlign: 'center' }}>您需要{this.state.studyIntegral}积分兑换该文章</p>
								</div>
								<div className="pop-btn">
									<Button onClick={() => this.hideModelDH()} loading={this.state.loadBtning} className="btn btn-blue" style={{ borderRadius: '5px', marginRight: '50px' }}>取消</Button>
									<Button className="btn btn-blue" loading={this.state.loadBtning} style={{ borderRadius: '5px' }} onClick={() => this.ok(this.state.essayId)}>确认</Button>
								</div>
							</div>
						</Layer>
						<div className="line"></div>
			             <Pages totalPage={this.state.totalPage} jump={this.jump.bind(this)}/>
					</div>
				</div>
			)
	}
}
export default CharMore;